<template>
  <div>
    <!-- 头部tab -->
    <!-- <div class="top_tab">
      <div class="left" @click="back()">
        <img  src="../assets/order_center/shangs.png">
      </div>
      <span>鸿包惠</span>
      <div class="right">
      </div>
    </div> -->
		<!-- <div class="kong"></div> -->
    <div class="list">
			<div class="boxt">
				<div class="info">
					<span>转赠金额：</span><input type="text" v-model="price" placeholder="请输入转赠金额">
				</div>
			</div>
			<div class="boxt">
				<div class="info">
					<span>对方手机号：</span><input type="text" v-model="phone" placeholder="请输入对方绑定的手机号">
				</div>
			</div>
			<div class="boxt">
				<div class="info">
					<span>安全密码：</span><input type="text" v-model="safepassword" placeholder="请输入安全密码">
				</div>
			</div>
			<div class="btn">
				<button class="affirm" @click="isOk()">确认</button>
				<button class="cancel" @click="back()">取消</button>
			</div>
		</div>
		
	</div>
</template>

<script>
import Vue from "vue";
import { CitySelect } from "vue-ydui/dist/lib.rem/cityselect";
Vue.component(CitySelect.name, CitySelect);
import District from "ydui-district/dist/jd_province_city_area_id";
export default {
  name: "donation",
  data() {
    return {
      isshow: false,
      show1: false,
      price:'',
      phone:'',
      safepassword:''
    };
  },
  methods: {
    back: function() {
      this.$router.go(-1);
    },
    isOk(){
		let self = this; 
		if(!this.price){
       		 this.$dialog.toast({mes:'请输入转赠金额'});
        return
		}
		if(!this.phone){
       		 this.$dialog.toast({mes:'请输入对方手机号'});
        return
		}
		if(!this.safepassword){
       		 this.$dialog.toast({mes:'请输入安全密码'});
        return
		}
		let url ="/api/zeng";
		self.httpPost(url,{token:this.token,user_id:this.myid,price:this.price,phone:this.phone,safepassword:this.safepassword},function(res) {
		if (res.code === 200) {
			self.$dialog.toast({mes:res.msg});
			setTimeout(() => {
				self.$router.go(-1);
			}, 1000);
        }else{
     	   self.$dialog.toast({mes:res.msg});
		}
	   })
	}
  },
	created(){
   		document.title = "鸿包惠";
   		this.token = localStorage.getItem('mytoken');
		this.myid = localStorage.getItem('myid');
  }
};
</script>


<style scoped>
.top_tab {
  width: 100%;
  padding: 0.2rem 0.3rem;
  background: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0.01rem 0.01rem 0.06rem #ddd;
  margin-bottom: 0.03rem;
  position: fixed;
}
.kong {
  width: 100%;
  height: 0.92rem;
}
.top_tab span {
  color: #333;
  font-size: 0.36rem;
}
.top_tab .right {
  width: 1rem;
  display: flex;
  justify-content: space-between;
}
.top_tab img {
  width: 0.43rem;
}
.list {
  width: 100%;
  padding: 0 0.3rem;
  background: #fff;
}
.list .boxt {
  width: 100%;
  height: 1rem;
  background: #fff;
  display: flex;
  align-items: center;
}
.list .boxt .info {
  width: 100%;
  height: 100%;
  border-bottom: 1px solid #eee;
  display: flex;
  align-items: center;
}

.list .boxt .info span {
  font-size: 0.28rem;
  color: #707070;
}
.boxt span {
  font-size: 0.28rem;
  color: #333;
}
.boxt input {
  border: none;
  flex: 1;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #9e9e9e;
}
input:-moz-placeholder,
textarea:-moz-placeholder {
  color: #9e9e9e;
}
input::-moz-placeholder,
textarea::-moz-placeholder {
  color: #9e9e9e;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #9e9e9e;
}
.btn {
  width: 100%;
  display: flex;
  justify-content: center;
  padding: 0.2rem 0.2rem;
}
.btn .affirm {
  width: 1.18rem;
  height: 0.6rem;
  background: #e63f3f;
  border: none;
  border-radius: 5px;
  font-size: 0.28rem;
  color: #fff;
}
.btn .cancel {
  width: 1.18rem;
  height: 0.6rem;
  background: #e7e6e9;
  border: none;
  border-radius: 5px;
  font-size: 0.28rem;
  color: #adadad;
  margin-left: 0.5rem;
}
.title {
  margin-top: 0.6rem;
  width: 100%;
  display: flex;
  justify-content: center;
}
</style>
<style>
.yd-cell-item {
  padding: 0;
	height: 1rem;
	padding-bottom:.12rem;
}
.yd-cell-left{
	align-items: flex-end;
}
.yd-cell-right{
	align-items: flex-end;
	padding-bottom:.1rem;
}
.yd-cell-right input[type=text]{
	height:.38rem;
	align-items: flex-end;
  font-size:.25rem;
}
</style>
<style>
.yd-cell-box{
	margin:0;
}
</style>




